// web/src/app/(employee)/employee/[id]/_components/employee-company-card.tsx
import {Company} from '@prisma/client';
import React from 'react';
import {Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle} from "@/components/ui/card";
import {Badge} from "@/components/ui/badge";
import {Separator} from "@/components/ui/separator";
import {Avatar, AvatarFallback, AvatarImage} from "@/components/ui/avatar";
import {format, formatDate} from "date-fns";
import Preview from "@/components/learn/preview";
import Link from "next/link";

interface Props {
    company: Company
}

const EmployeeCompanyCard = ({company}: Props) => {
    return (
        <div className={`m-4`}>
            <Link href={`/company/${company.id}`}>
                <Card>
                    <CardHeader>
                        <CardTitle>
                            <div className={`flex items-center gap-x-2`}>
                                <Avatar className={`size-14 rounded-full`}>
                                    <AvatarImage className={`rounded-full`} src={company.image!}/>
                                    <AvatarFallback className={`bg-blue-400 text-white rounded-full`}>
                                        {company.name.charAt(0).toUpperCase()}
                                    </AvatarFallback>
                                </Avatar>
                                <div className={`flex flex-col gap-1`}>
                                    <span className={`text-lg`}>公司介绍</span>
                                    <span
                                        className={`text-sm`}>成立时间: {format(company.creationTime!, 'yyyy-MM-dd')}</span>
                                </div>
                            </div>
                        </CardTitle>
                    </CardHeader>
                    <CardContent>
                        <CardDescription>
                            <Preview value={company.description!}/>
                        </CardDescription>
                    </CardContent>
                    <CardFooter className={`text-sm`}><strong>地址</strong>: {company.location}</CardFooter>
                </Card>
            </Link>
        </div>
    );
};

export default EmployeeCompanyCard;